<template>
    <div class="cell-month">
        <div class="weeklist">
            <p class="top" v-for="(item,index) in weekData">
                {{item}}
            </p>
            <div class="monthDayList">
                <div v-for="(item,index) in daysData" class="dayList" :class="{'selectDay':isSelect == index,unData:item.day == ' '}">
                    <p class="day">{{item.day}}</p>
                    <p class="day col" v-if="item.price" @click="selectDate(index,item.price,item.childPrice,item.day,'true')">{{item.price}}</p>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import { Toast } from 'mint-ui';
export default {

    props: {
        dateData: Array,
        day: String,
    },

    data() {

        return {
            isDshow: 'false',
            typs: 'true',
            weekData: ['日', '一', '二', '三', '四', '五', '六'],
            currentDay: this.day,
            DaysInMonth: [],
            daysData: [],
            priceData: this.dateData,
            isSelect: -1,
            undate: 1,
            time: ''

        }
    },
    methods: {
        back() {
            this.$router.push('/home');
        },
        getYearMonthDay() {
            let currentYear = this.$data.currentDay.substring(0, 4); //当前年份
            let currentMonth = this.$data.currentDay.substring(5, 7); //当前月份

            //判断是否是闰年
            if (this.isleapYears(currentYear)) {
                this.$data.DaysInMonth = [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
            } else {

                this.$data.DaysInMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
            }

            let monthDay = this.$data.DaysInMonth[Number(currentMonth) - 1];//当前月的天数
            let daysData = [];
            // console.log(monthDay);
            //给数据源赋值
            for (var i = 0; i < Number(monthDay); i++) {
                var priceDict = { 'day': String(i + 1), 'price': 0, 'childPrice': 0 };
                daysData.push(priceDict);
            }
            // console.log(daysData);
            this.$data.daysData = daysData;

            var currentDay = `${currentYear}-${currentMonth}-01`;

            var dateObject = new Date(currentDay);
            var firstDay = dateObject.getDay();//得到每个月1号是周几
            // console.log(this.priceData);

            for (var i in this.$data.priceData) {
                var price = this.$data.priceData[i];
                // console.log(price);
                var dayIndex = price.priceDate.substring(price.priceDate.length - 2, price.priceDate.length);
                // console.log(dayIndex);
                var dayDict = daysData[Number(dayIndex) - 1];
                // console.log(price);
                dayDict.price = price.price;
                dayDict.childPrice = price.childPrice;
            }
            if (firstDay > 0) {
                var firstDayData = [];
                for (var i = 0; i < firstDay; i++) {
                    var dict = { 'day': ' ', price: ' ', childPrice: '' };
                    firstDayData.push(dict);
                }

                this.$data.daysData = firstDayData.concat(daysData);

            } else {
                this.$data.daysData = daysData;
            }
            // console.log(this.daysData);
        },
        isleapYears(year) {
            if (((year % 4) == 0) && ((year % 100) != 0) || ((year % 400) == 0)) {
                return true;
            } else {
                return false;
            }
        },
        selectDate(index, prc, cprc, time, type) {
            if (this.$data.daysData[index].day == 0) {
                return;
            }
            this.$data.isSelect = index
            // console.log(index);
            // console.log(time);
            let mont = sessionStorage.getItem('yearmonth')
            // console.log(mont + '-' + time);
            sessionStorage.setItem('speData', mont + '-' + time)
            sessionStorage.setItem('price', prc)
            sessionStorage.setItem('childPrice', cprc)

            let ftime = sessionStorage.getItem('speData')
            this.isDshow = type
            this.$emit('changetype', {type,ftime})
            // this.$emit('changetype', ftime)

            if (prc == 0 || '') {
                Toast({ message: '当前选中日期不可选', duration: 1000 })
                sessionStorage.removeItem('speData')
            }
            // console.log(this.daysData);
            // this.back();
        },

    },

    created() {
        this.getYearMonthDay();
    }

}
</script>


<style lang="stylus" scoped>
.weeklist {
    background-color: white;
    width: 100%;
    height: 30px;

    p.top {
        float: left;
        width: 14%;
        padding-left: 10px;
        padding-right: 10px;
        color: #999999;
        text-align: center;
        font-size: 16px;
    }

    .active {
        color: #8fc31f;
    }
}

.monthDayList {
    display: block;
    width: 100%;
    background-color: red;

    .dayList {
        position: relative;
        float: left;
        width: 14%;
        height: 50px;
        padding: 5px;
        text-align: center;

        p.day {
            float: initial;
            width: 100%;
            font-size: 14px;
            text-align: center;
            padding: 0px 0px 0px 0px;
        }

        p.col {
            color: #FF7E00;
        }
    }

    .selectDay {
        background-color: #8fc31f;

        p {
            color: white;
        }

        p.col {
            color: white;
        }
    }
}

// .selectDay {
// background-color: #42bd56;

// p {
// color: white;
// }
// }
.unData {
    p {
        color: white;
    }
}
</style>